import React from 'react'
// ===================================================================== Temp
import SubmitForm from '#cpt/temp/SubmitForm'
import Table from '#cpt/temp/Table'
import Controls from '#cpt/temp/Controls'
// ===================================================================== global declare
const { $fn, $Lazy } = window
// =====================================================================Lazy
const Page 		= $Lazy.load(()=>import('#tp/page/page-container'))
const SaoImage 	= $Lazy.load(()=>import('#tp/sao'))
// =====================================================================
const afterSuffix = <SaoImage />
const width = 500
const statusData = [{name:'待分发',value:'0'},{name:'不可分发',value:'-1'},{name:'已分发',value:'1'}]
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		// 搜索表单列表
		formData : [
			{ label:'标本箱条码',			name: 'box_code', 	width, p:'请扫描或输入条码号', required:true, afterSuffix, onValue:({value})=> {this.query.box_code=value} },
			{ label:' ', tag:'批量转移',		name: 'is_batch', 	width, type:'checkbox', onChange:option => $fn.hideToRows.call(this, option, 'end_code') },
			{ label:'标本条码',				name: 'start_code', width, p:'请扫描或输入条码号', required:true, afterSuffix, br:true },
			{ label:'结束标本号',			name: 'end_code', 	width, p:'请扫描或输入条码号', required:true, afterSuffix, hide:true },
			{ label:'确认', width:150, type:'button', onClick:()=> this.formRef.submit()},
		],
	}
	query = {}
	
	// paging
	fetch = () => $fn.fetch.call(this,'box/specCodeInfo')
	
	// 表单
	cols = [
		{ title: '条码号', 			dataIndex: 'spec_code', 		...$fn.table.spec_code },
		{ title: '送检单位', 		dataIndex: 'hosp_name', 	width:200 },
		{ title: '送检地址', 		dataIndex: 'address', 		width:200 },
		{ title: '状态', 			dataIndex: 'spec_status', 		width:100, render:text=>$fn.getState(statusData,text) },
	]
	
	// 操作按钮
	controls = () => {
		return [
			Controls.back.call(this )
		]
	}
	
	render(){
		return (
			<Page title='部分转移' controls={this.controls()}>
				{/* 提交 */}
				<div className='pt20'>
					{ SubmitForm.call(this,{ labelWidth:'s11', api:'box/partmove', onOk:({ data })=> {
						this.fetch()
					} }) }
				</div>
				<div className='f12 xplr mb20' style={{color:'red'}}>提示：当前列表中展示的条码信息为新标本箱条码信息</div>
				{/* 表格 */}
				{ Table.call(this, { type: -1 }) }
			</Page>
		)
	}
}

export default Index